import 'dart:io';

import 'package:flutter/material.dart';
import 'package:edu/constants/app_icons.dart';
import 'package:edu/constants/app_strings.dart';

class ThirdAuthAccountPage extends StatelessWidget {
  const ThirdAuthAccountPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text(AppStrings.thirdAccount)),
      body: Column(
        children: [
          const SizedBox(height: 20),
          _buildRowCell(context, AppIcons.wechart, AppStrings.wechart),
          const SizedBox(height: 20),
          _buildRowCell(context, AppIcons.qq, AppStrings.qq),
          const SizedBox(height: 20),
          _buildRowCell(context, AppIcons.weibo, AppStrings.weibo),
          if (Platform.isIOS || Platform.isMacOS) const SizedBox(height: 20),
          if (Platform.isIOS || Platform.isMacOS)
            _buildRowCell(context, AppIcons.wechart, AppStrings.wechart),
        ],
      ),
    );
  }

  Widget _buildRowCell(BuildContext context, String icon, String title) {
    final fontSize =
        (Theme.of(context).appBarTheme.titleTextStyle?.fontSize ?? 20) - 4;
    return Row(
      children: [
        const SizedBox(width: 20),
        Container(
          width: 40,
          height: 40,
          decoration: BoxDecoration(
            shape: BoxShape.circle,
            color: Theme.of(context).colorScheme.surface,
          ),
          child: Center(
            child: ColorFiltered(
              colorFilter: ColorFilter.mode(Colors.grey[600]!, BlendMode.srcIn),
              child: Image.asset(icon, width: 25),
            ),
          ),
        ),
        const SizedBox(width: 10),
        Text(title, style: TextStyle(fontSize: fontSize)),
        const Spacer(),
        Container(
          decoration: BoxDecoration(
            border: Border.all(
              color: Theme.of(context).colorScheme.primary,
              width: 1,
            ),
            borderRadius: BorderRadius.circular(15),
          ),
          child: TextButton(
            onPressed: () {},
            child: Text(AppStrings.bind, style: TextStyle(fontSize: fontSize)),
          ),
        ),
        const SizedBox(width: 20),
      ],
    );
  }
}
